/**
 * 注册和登录
 */
import React, { Component } from 'react';
import style from './Login.module.scss';

// 导入页面所需组件
import SignInBox from './SignInBox';
import SignUpBox from './SignUpBox';

export default class Login extends Component {
    constructor(props) {
        super(props);
        this.state = {
            isSignIn: true
        }
    }

    /**
     * 登录或注册验证成功后显示管理界面的事件
     */
    goManagePage = () => {
        // 执行登录成功方法
        this.props.loginSuccess();
    }

    //渲染界面
    render() {
        return (
            <div className={style.container}>
                {/* 条件性地显示登录框或注册框 */}
                {
                    this.state.isSignIn 
                    ?
                    <SignInBox
                        switchLoginBox={() => {
                            this.setState({
                                isSignIn: !this.state.isSignIn
                            });
                        }}
                        goManagePage={this.goManagePage}
                    />
                    :
                    <SignUpBox 
                        switchLoginBox={() => {
                            this.setState({
                                isSignIn: !this.state.isSignIn
                            });
                        }}
                        goManagePage={this.goManagePage}
                    />
                }
            </div>
        )
    }
}
